<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <title>纸条盲盒系统 API 文档</title>
    <link rel="stylesheet" type="text/css" href="https://unpkg.com/swagger-ui-dist@3/swagger-ui.css">
    <style>
      body {
        margin: 0;
        padding: 0;
        font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
      }
      .swagger-ui .topbar {
        /* We hide the default topbar and use our custom one */
        display: none;
      }
      #custom-header {
        background-color: #222;
        color: white;
        padding: 15px 30px;
        display: flex;
        align-items: center;
        justify-content: space-between;
      }
      #custom-header h1 {
        font-size: 24px;
        margin: 0;
        font-weight: 500;
      }
      #token-wrapper {
        background-color: #fafafa;
        padding: 0;
        border-bottom: 1px solid #eee;
        box-shadow: 0 1px 3px rgba(0,0,0,0.05);
      }
      #token-form {
        max-width: 1460px;
        padding: 20px 30px;
        margin: 0 auto;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
      }
      #token-form-label {
        font-weight: bold;
        margin-right: 15px;
        font-size: 14px;
        color: #3b4151;
        flex: 0 0 140px;
        white-space: nowrap;
      }
      #token-input-container {
        position: relative;
        flex: 1;
        min-width: 260px;
        max-width: 800px;
        margin-right: 15px;
      }
      #bearer-token {
        width: 100%;
        padding: 8px 10px;
        border: 1px solid #d9d9d9;
        border-radius: 4px;
        font-family: monospace;
        font-size: 14px;
        outline: none;
        transition: all 0.3s;
        box-sizing: border-box; /* Ensure padding doesn't affect width */
      }
      #bearer-token:focus {
        border-color: #49cc90;
        box-shadow: 0 0 0 3px rgba(73,204,144,0.15);
      }
      #update-token {
        background-color: #49cc90;
        color: white;
        border: none;
        border-radius: 4px;
        padding: 9px 15px;
        font-size: 14px;
        font-weight: bold;
        cursor: pointer;
        transition: background-color 0.3s;
        white-space: nowrap;
      }
      #update-token:hover {
        background-color: #3ebb7e;
      }
      #update-token:active {
        background-color: #2fa066;
      }
      #token-status {
        display: none;
        margin-left: 15px;
        color: #49cc90;
        font-size: 14px;
        align-items: center;
        white-space: nowrap;
      }
      #token-status.visible {
        display: flex;
      }
      #token-status svg {
        margin-right: 5px;
      }
      #swagger-ui-container {
        /* Add some padding if needed */
      }
      /* 复制按钮样式 */
      .copy-api-url {
        background-color: #6BBBAE;
        color: white;
        border: none;
        border-radius: 4px;
        padding: 6px 12px;
        font-size: 12px;
        font-weight: bold;
        cursor: pointer;
        transition: all 0.2s;
        margin-left: 10px;
        display: flex;
        align-items: center;
        box-shadow: 0 1px 3px rgba(0,0,0,0.1);
      }
      .copy-api-url:hover {
        background-color: #5AA99C;
        box-shadow: 0 2px 5px rgba(0,0,0,0.15);
      }
      .copy-api-url:active {
        background-color: #4D968A;
        transform: translateY(1px);
      }
      .copy-api-url svg {
        margin-right: 5px;
        width: 14px;
        height: 14px;
      }
      .copy-tooltip {
        position: fixed;
        background: rgba(0,0,0,0.7);
        color: white;
        padding: 5px 10px;
        border-radius: 4px;
        font-size: 12px;
        pointer-events: none;
        opacity: 0;
        transition: opacity 0.2s;
        z-index: 9999;
      }
      .copy-tooltip.visible {
        opacity: 1;
      }
      @media (max-width: 768px) {
        #token-form {
          flex-direction: column;
          align-items: stretch;
        }
        #token-form-label {
          margin-bottom: 10px;
          flex: 0 0 auto; /* Reset flex basis */
        }
        #token-input-container {
          width: 100%;
          margin-bottom: 10px;
          margin-right: 0;
        }
        #update-token {
          align-self: flex-start;
        }
        #token-status {
          margin-left: 0;
          margin-top: 10px;
        }
      }
    </style>
  </head>
  <body>
    <!-- 顶部标题栏 -->
    <div id="custom-header">
      <h1>纸条盲盒系统 API 文档</h1>
    </div>

    <!-- 自定义令牌输入区 -->
    <div id="token-wrapper">
      <div id="token-form">
        <div id="token-form-label">Authorization令牌:</div>
        <div id="token-input-container">
          <input type="text" id="bearer-token" placeholder="输入Bearer令牌..." value="eyJvcGVuaWQiOiJ0ZXN0X29wZW5pZF8xIiwiaWQiOjEsInRpbWUiOjE3NDQ5NDE2Mjh9">
        </div>
        <button id="update-token">应用令牌</button>
        <div id="token-status">
          <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
            <path d="M13.854 3.646a.5.5 0 0 1 0 .708l-7 7a.5.5 0 0 1-.708 0l-3.5-3.5a.5.5 0 1 1 .708-.708L6.5 10.293l6.646-6.647a.5.5 0 0 1 .708 0z"/>
          </svg>
          令牌已更新
        </div>
      </div>
    </div>

    <!-- 复制提示工具提示 -->
    <div id="copy-tooltip" class="copy-tooltip">已复制!</div>

    <!-- Swagger UI 容器 -->
    <div id="swagger-ui-container">
      <div id="swagger-ui"></div>
    </div>

    <script src="https://unpkg.com/swagger-ui-dist@3/swagger-ui-bundle.js"></script>
    <script src="https://unpkg.com/swagger-ui-dist@3/swagger-ui-standalone-preset.js"></script>
    <script>
      let swaggerUI;
      // 初始默认令牌
      let currentToken = "eyJvcGVuaWQiOiJ0ZXN0X29wZW5pZF8xIiwiaWQiOjEsInRpbWUiOjE3NDQ5NDE2Mjh9";
      // 复制提示工具提示
      const copyTooltip = document.getElementById('copy-tooltip');

      // 显示令牌更新状态
      function showTokenStatus() {
        const status = document.getElementById('token-status');
        if (status) {
          status.classList.add('visible');
          // 3秒后隐藏状态
          setTimeout(() => {
            status.classList.remove('visible');
          }, 3000);
        }
      }

      // 更新令牌函数
      function updateToken() {
        const tokenInput = document.getElementById('bearer-token');
        if (!tokenInput) return;
        
        currentToken = tokenInput.value.trim();
        console.log('Token updated to:', currentToken);

        if (swaggerUI && swaggerUI.authActions && typeof swaggerUI.authActions.authorize === 'function') {
          try {
            // 更新UI授权信息
            swaggerUI.authActions.authorize({
              bearerAuth: {
                name: "bearerAuth",
                schema: {
                  type: "http",
                  scheme: "bearer",
                  bearerFormat: "JWT" // 明确指定格式
                },
                value: currentToken
              }
            });
            // 显示状态提示
            showTokenStatus();
          } catch (e) {
            console.error('Error updating token authorization:', e);
            alert('更新令牌时出错，请检查控制台。');
          }
        } else {
          console.warn('Swagger UI or authActions not ready for token update.');
        }
      }

      // 复制到剪贴板函数
      function copyToClipboard(text) {
        // 创建临时文本区域
        const textArea = document.createElement('textarea');
        textArea.value = text;
        textArea.style.position = 'fixed';  // 避免滚动到底部
        textArea.style.opacity = '0';
        document.body.appendChild(textArea);
        textArea.select();
        
        try {
          // 执行复制命令
          const successful = document.execCommand('copy');
          if (successful) {
            showCopyTooltip(event);
          } else {
            console.error('复制失败');
          }
        } catch (err) {
          console.error('复制时出错:', err);
        }
        
        // 清理临时文本区域
        document.body.removeChild(textArea);
      }

      // 显示复制成功提示
      function showCopyTooltip(event) {
        if (!copyTooltip) return;
        
        // 定位在鼠标位置附近
        copyTooltip.style.left = (event.clientX + 10) + 'px';
        copyTooltip.style.top = (event.clientY - 25) + 'px';
        copyTooltip.classList.add('visible');
        
        // 2秒后隐藏提示
        setTimeout(() => {
          copyTooltip.classList.remove('visible');
        }, 2000);
      }

      // 添加复制按钮到操作面板
      function addCopyUrlButtons() {
        // 选择所有操作面板
        setTimeout(() => {
          const operationTags = document.querySelectorAll('.opblock-summary');
          operationTags.forEach(tag => {
            // 检查是否已添加复制按钮
            if (tag.querySelector('.copy-api-url')) return;
            
            // 获取操作方法和路径
            const methodElement = tag.querySelector('.opblock-summary-method');
            const pathElement = tag.querySelector('.opblock-summary-path');
            
            if (methodElement && pathElement) {
              const method = methodElement.textContent.trim();
              const path = pathElement.textContent.trim() || pathElement.getAttribute('data-path');
              
              if (path) {
                // 构建完整API URL
                const baseUrl = ''; // 例如 https://api-mh.xianxia99.com
                const fullUrl = `${baseUrl}${path}`;
                
                // 创建复制按钮
                const copyButton = document.createElement('button');
                copyButton.className = 'copy-api-url';
                copyButton.title = '复制API地址';
                copyButton.innerHTML = `
                  <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" fill="currentColor" viewBox="0 0 16 16">
                    <path d="M4 1.5H3a2 2 0 0 0-2 2V14a2 2 0 0 0 2 2h10a2 2 0 0 0 2-2V3.5a2 2 0 0 0-2-2h-1v1h1a1 1 0 0 1 1 1V14a1 1 0 0 1-1 1H3a1 1 0 0 1-1-1V3.5a1 1 0 0 1 1-1h1v-1z"/>
                    <path d="M9.5 1a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-3a.5.5 0 0 1-.5-.5v-1a.5.5 0 0 1 .5-.5h3zm-3-1A1.5 1.5 0 0 0 5 1.5v1A1.5 1.5 0 0 0 6.5 4h3A1.5 1.5 0 0 0 11 2.5v-1A1.5 1.5 0 0 0 9.5 0h-3z"/>
                  </svg>
                  复制
                `;
                
                // 添加点击事件
                copyButton.addEventListener('click', function(event) {
                  event.preventDefault();
                  event.stopPropagation();
                  copyToClipboard(fullUrl);
                });
                
                // 将按钮添加到操作标签中
                tag.appendChild(copyButton);
              }
            }
          });
        }, 2000); // 给UI一些时间加载
      }

      // 定时检查并添加复制按钮
      function setupCopyButtonObserver() {
        // 添加初始按钮
        addCopyUrlButtons();
        
        // 设置定时器定期检查新的操作标签
        setInterval(addCopyUrlButtons, 3000);
        
        // 监听DOM变化以添加复制按钮
        const observer = new MutationObserver((mutations) => {
          let shouldAddButtons = false;
          
          mutations.forEach(mutation => {
            if (mutation.type === 'childList' && 
                (mutation.target.classList.contains('opblock') || 
                 mutation.target.classList.contains('operations-container'))) {
              shouldAddButtons = true;
            }
          });
          
          if (shouldAddButtons) {
            addCopyUrlButtons();
          }
        });
        
        // 开始观察Swagger UI容器
        const swaggerContainer = document.getElementById('swagger-ui');
        if (swaggerContainer) {
          observer.observe(swaggerContainer, { 
            childList: true, 
            subtree: true 
          });
        }
      }

      // 页面加载完成时执行
      window.onload = function() {
        // 全局错误处理
        window.onerror = function(message, source, lineno, colno, error) {
          console.error('Global error caught:', { message, source, lineno, colno, error });
          // 尝试阻止默认错误处理，以防中断UI
          return true;
        };
        
        // 初始化Swagger UI
        try {
          swaggerUI = SwaggerUIBundle({
            // 使用动态生成脚本
            url: "/swagger-simple.php",
            dom_id: '#swagger-ui',
            deepLinking: true,
            validatorUrl: null, // 禁用验证以避免潜在问题
            displayRequestDuration: true,
            docExpansion: 'list', // 默认展开列表
            defaultModelsExpandDepth: 3,
            defaultModelExpandDepth: 3,
            presets: [
              SwaggerUIBundle.presets.apis,
              SwaggerUIStandalonePreset
            ],
            plugins: [
              SwaggerUIBundle.plugins.DownloadUrl
            ],
            layout: "StandaloneLayout",
            // 请求拦截器，添加认证头
            requestInterceptor: function(request) {
              try {
                if (!request.headers) {
                  request.headers = {};
                }
                request.headers['Accept'] = 'application/json;charset=utf-8';
                // 如果有当前令牌，则添加Authorization头
                if (currentToken) {
                  request.headers['Authorization'] = 'Bearer ' + currentToken;
                }
                console.log('Request intercepted:', request);
              } catch (e) {
                console.error('Error in requestInterceptor:', e);
              }
              return request;
            },
            // 响应拦截器，可以用于调试
            responseInterceptor: function(response) {
              console.log('Response intercepted:', response);
              return response;
            }
          });

          // 等待UI加载后尝试设置默认授权
          setTimeout(() => {
             if (swaggerUI && swaggerUI.authActions && typeof swaggerUI.authActions.authorize === 'function') {
                try {
                  console.log('Attempting to set initial authorization...');
                  swaggerUI.authActions.authorize({
                    bearerAuth: {
                      name: "bearerAuth",
                      schema: {
                        type: "http",
                        scheme: "bearer",
                        bearerFormat: "JWT"
                      },
                      value: currentToken
                    }
                  });
                  console.log('Initial authorization set.');
                } catch (e) {
                  console.error('Error setting initial authorization:', e);
                }
             } else {
               console.warn('Swagger UI or authActions not ready for initial authorization.');
             }
          }, 1500); // 增加延迟确保UI准备好

          // 设置复制按钮
          setTimeout(setupCopyButtonObserver, 2000);

        } catch(e) {
           console.error('Error initializing SwaggerUI:', e);
           // 可以在这里显示错误信息给用户
           const uiContainer = document.getElementById('swagger-ui');
           if (uiContainer) {
             uiContainer.innerHTML = '<div style="color: red; padding: 20px;">加载API文档时出错，请检查浏览器控制台获取详细信息。</div>';
           }
        }

        // 添加按钮和输入框事件监听
        const updateButton = document.getElementById('update-token');
        const tokenInput = document.getElementById('bearer-token');
        
        if (updateButton) {
          updateButton.addEventListener('click', updateToken);
        }
        if (tokenInput) {
          tokenInput.addEventListener('keyup', function(event) {
            if (event.key === 'Enter') {
              updateToken();
            }
          });
        }
        
        window.ui = swaggerUI;
      };
    </script>
  </body>
</html> 